<!--
 * @Date: 2019-11-06 10:43:32
 * @LastEditors: peng qiao
 * @LastEditTime: 2020-03-23 15:20:23
 -->
<template>
  <div class="dynamicDetails">
    <van-nav-bar
      title="公告详情"
      left-arrow
      @click-left="$router.go(-1)"
      fixed
    />
    <div class="news-details" style="width: 100%;">
      <p class="title-style artical-sub-title">{{ viewDetailList.subject }}</p>
      <div class="label-text" style="position: relative">
        <p class="releaseTime" style="top:0">发布时间： {{ viewDetailList.creationDate }}</p>
        <p class="source" style="top:0">来源： {{ viewDetailList.neighborhoodName }}</p>
      </div>
      <div class="title-img" v-if="viewDetailList.headImage" style="margin-top:3px;">
        <img v-lazy="viewDetailList.headImage" :key="viewDetailList.headImage"/>
      </div>
      <div class="news-content" :class="communityContent">
        <div class="html_box" v-html="viewDetailList.content"></div>
      </div>
    </div>
  </div>
</template>
<script>
import api from "@/controller/Interface.js";
import constant from "@/controller/constant.js";
export default {
  name: "noticeDetails",
  data() {
    return {
      viewDetailList: {},
      communityContent: ''
    };
  },
  mounted() {
    this.getNoticeDetail(this.$route.query);
  },
  methods: {
    getNoticeDetail(id) {
      api.announcements_v1_get(id).then(res => {
        if (res.code === "0") {
          this.viewDetailList = res.datas
          if (this.viewDetailList.headImage) {
            this.communityContent = 'has-img-box'
          } else {
            this.communityContent = 'no-img-box'
          }
        } else {
          if (res && res.msg) {
            this.$toast(res.msg);
          } else {
            this.$toast(constant.unusualMsg);
          }
        }
      });
    }
  }
};
</script>
<style lang="scss" scope>
@import "../workstation/styles/newsDetails.scss";
.dynamicDetails {
  height: 100%;
	background: #ffffff;
	.news-details {
		height: auto;
  }
  .artical-sub-title {
    position: relative !important;
    top: 0 !important;
    padding: 5px 15px;
    left: 0 !important;
    width: 345px;
    right: 0;
  }
}
</style>
